前言

今天是最後一天，我想分享這段 Vibe Coding 之後的心得以及開發流程回顧，給未來想嘗試自己 Vibe Coding 做產品的朋友。

可以自己 Vibe Coding，但是要有時間和心力

30 天後，我有個心得是除非市面上的工具真的完完全全無法滿足我的需求，也沒有辦法用任何替代或組合工具的方式來處理，那樣的需求出現時，我才會再回去自己做小工具來使用。另外一個最大的限制，就是心力跟時間的限制。因為有時候忙完工作，其實已經沒有任何時間和心力再去處理 Vibe Coding 相關的事情，所以我覺得這是一個很現實的條件。要真的有一種很想把自己的東西做出來的決心，還有意志力，不然很容易中途拖延，或是一忙就停下來了。

做一個好產品是不簡單的事

對我來說，最重要的還是這個過程讓我學到更多怎麼跟 AI 溝通，以及怎麼在開發和設計流程上運用 AI，這些是我最大的收穫。至於產品的好壞，已經不是我現在最主要的目標，和過去我用的呼吸放鬆 App 的成熟度相比，還差了一截，好歹人家也做了好幾年！！！但我會把這個產品繼續當作練習 AI 協作的實驗場。

人類，開發我很熟，有什麼問題盡量大膽地問我

我覺得在開發過程中，讓我學到一個蠻重要的心法：大膽去嘗試你腦中的點子或想法。會講到這個，是因為我原本在做這個 App 的時候想做人聲引導。但一開始大腦會覺得這東西好麻煩、要找人錄，可能會完成不了，所以自己就先否決掉了這個提案。但做完之後發現沒有這個功能時，又覺得缺少了一個蠻核心的體驗。後來回去跟 AI 討論，才發現其實有一些方便快速的替代解決方案。所以，大膽提問給 AI 吧。

請 AI 當使用者研究員來訪談你

這 30 天很常用的一個做法是，有時提問時不確定這樣問好不好、夠不夠完整，所以會先把自己的意圖寫下來，我想知道什麼、為什麼，以及目前已經知道哪些背景，接著再請 AI 訪談我還沒想清楚的地方。在一問一答之間，幫助我把模糊的想法變得具體。

我的開發流程紀錄分享

Step 1: 產品規劃

在產品規劃階段，我分成幾個小步驟進行。

1-1: PRD 規劃

寫下自己對產品的想像，包含需求、使用情境與功能。

參考文章：Day 3 | PRD 初稿撰寫

1-2: 視覺與介面

視覺

• 先用 2–3 個形容詞，描述你希望使用者打開產品時有什麼感覺。以這個呼吸 App 為例，我選的是「平靜、自然、溫暖」。接著從這些形容詞出發，回想和收集對應的視覺意象，可以是自己拍的照片、喜歡的產品畫面，或是 Dribbble、Pinterest、Twitter 上設計師大大們的作品，整理成一張靈感板。

參考文章：Day 4 | 產品視覺設計方向介紹與初探

介面與核心體驗流程

• 在這個層面，可以參考 Mobbin 這類網站，看看不同領域的知名產品如何設計各種功能的流程，例如註冊登入、導覽、付款等，最近付費版也推出 MCP 功能，用 Coding Agent 接上去後可以直接幫你實作出你看到的這些參考圖的模式、元件或流程https://mobbin.com/mcp。我自己還沒實際試過，有興趣的朋友可以試試看。
• 核心流程體驗可以透過隨意手繪，想像自己是使用者，進來 App 後，思考產品會長什麼樣子，會希望看到哪些資訊。
  • 參考文章：Day 5 | 來畫 Wireframe 階段 1 - 呼吸練習

1-3: 與 AI 協作 PRD，並利用親和圖法整理建議

有了前面兩個素材後，接下來可以請 AI 擔任在產品開發中重要的幾個角色，分別是 PM / Designer / Engineer 等角色，來幫你看這份 PRD 在進入實作之前，還有哪些不足甚至需要補充決策的。

AI 的建議和內容可能會很多，在 Day 8 時我有介紹過可以使用親和圖法，來有效整理這些建議和需求，幫助你更快做出決策，不用看這麼多文字資料。

參考文章：Day 8 | AI 大大們給的 PRD 建議這麼多，如何進行有效資料整理?

Step 2: 開發

2-1: 安裝與熟悉開發工具

先熟悉基本的 Git 與 GitHub 的原理，以及 iOS 開發使用的 Xcode 等。

參考文章：

Day 10｜開發前的準備：用哪些技術與 AI 工具打造 iOS App？

Day 12 | 理解 Git 與 GitHub

Day 19 | 如何在 iPhone 上安裝 Xcode 開發好的 App 做測試

2-2: 了解使用 Coding Agents 有哪些 Best Practice 或小技巧

參考之前寫的文章，關於使用的技巧、Skills、以及充分利用 Claude Opus 5.5 的方式。

參考文章：

Day 18 | 跟 Claude Code 負責人學習使用小技巧

Day 23 | Skills 是什麼？一起與 AI 建一個

Day 24 | 閱讀分享與心得整理 - 如何充分使用 Claude Opus 5.5 模型

2-3: 定義開發任務及驗收條件，讓 Coding Agents 自動開發與驗收

PRD 完成後，我請 AI 讀取 PRD 並規劃開發任務。我拆任務的方式是每個任務都是一次可以獨立 review 的開發 PR，盡量把任務拆小。

定義驗收條件的部分，因為我看不懂程式碼，所以會先把「預期行為」寫清楚，再請 AI 從 QA 的角度追問我沒想到的情況，把完整的驗收條件定義清楚。

參考文章：Day 17 | 看不懂程式碼，如何知道 AI 做的對不對？

2-4: 建立 UI Playground

在 Day 28，我參考 Notion 和 Linear 設計師的做法，建立了一個 UI Playground：在不影響正式程式碼的情況下，把不同設計方案的畫面放在同一個網頁，切換比較圓角、排版、字體風格等細節。我是在 App 大致完成後才做。但我認為它很適合在開發前期就開始。

參考文章：Day 28 | 建立 UI Playground，探索不同設計方案

Step 3: 測試與產品迭代優化

完成開發後，我把 App 裝到 iPhone 上實際練習，記下每個畫面的感受與體驗，再請 AI 解釋相關的程式碼、找出原因，接著回到 Step 2 修正。迭代最明顯的例子是人聲引導。規劃時我把它移進 backlog，實際練習後才發現少了它不行，於是用 ElevenLabs 補上人聲引導。

參考文章：

Day 20 | 為自己開發的 App 做一次體驗測試後，我推翻了在 PRD 的決策

Day 25 | 用 ElevenLabs 製作呼吸練習時的人聲引導

結語

謝謝各位的瀏覽，希望我的經驗能夠幫助到對 AI 和 Vibe Coding 有興趣的朋友，Cheers 🍻